<link type="text/css" href="${request.contextPath}/static/oms/iframe/plugins/jeditor/css/jeditor.css" rel="stylesheet" />
<link href="${request.contextPath}/static/oms/iframe/plugins/bootstrap-image-picker/css/image-picker.css"  rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="${request.contextPath}/static/oms/iframe/plugins/fileupload/css/jquery.fileupload-ui.css">
<div class="row">
	<div class="col-md-12">
		<form id="siteEditForm" class="form-horizontal" action="${request.contextPath}/cms/site/update" method="post" onsubmit="return false">
			<input type="hidden" id="id" name="id" value="${cmsSite.id}">
			<div class="box-body">
				<div class="form-group">
					<label id="siteNameLabel" for="siteName" class="col-sm-2 control-label">名称</label>
					<div class="col-sm-4">
						<input type="text" class="form-control" name="name" id="siteName" value="${cmsSite.name}" placeholder="输入名称...">
					</div>
					<label id="shortTitleLabel" for="siteShortTitle" class="col-sm-2 control-label">短标题</label>
					<div class="col-sm-3">
						<input type="text" class="form-control" name="shortTitle" id="siteShortTitle"  value="${cmsSite.shortTitle}" placeholder="输入短标题...">
					</div>
				</div>
				<div class="form-group">
					<label id="siteTitleLabel" for="siteTitle" class="col-sm-2 control-label">标题</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="title" id="siteTitle"  value="${cmsSite.title}" placeholder="输入标题...">
					</div>
				</div>
				<div class="form-group">
					<label id="siteFaviconLabel" for="siteFavicon" class="col-sm-2 control-label">快捷图标</label>
					<div class="col-sm-6">
						<input type="text" class="form-control" name="favicon" id="siteFavicon" value="${cmsSite.favicon}" readonly placeholder="输入快捷方式图标...">
					</div>
					<div class="col-sm-4">
						<span class="btn btn-success fileinput-button">
							<i class="glyphicon glyphicon-plus"></i>
							<span>选择文件</span>
							<input id="siteFaviconFileupload"  class="fileinput-button"  type="file" name="file"  data-url="/system/config/file/add?type=1" multiple>
						 </span>
					</div>
				</div>
				<div class="form-group">
					<label id="siteLogoLabel" class="col-sm-2 control-label" >Logo</label>
					<div class="col-sm-6">
						<input type="text" class="form-control" name="logo" id="siteLogo"  value="${cmsSite.logo}" readonly placeholder="输入Logo...">
					</div>
					<div class="col-sm-4">
						<span class="btn btn-success fileinput-button">
							<i class="glyphicon glyphicon-plus"></i>
							<span>选择文件</span>
							<input id="siteLogoFileupload"  class="fileinput-button"  type="file" name="file"  width="60" data-url="/system/config/file/add?type=1" multiple>
						 </span>
					</div>
				</div>
				<div class="form-group">
					<label id="siteKeywordsLabel" for="siteKeywords" class="col-sm-2 control-label">关键字</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="keywords" id="siteKeywords" value="${cmsSite.keywords}" placeholder="输入关键字...">
					</div>
				</div>
				<div class="form-group">
					<label id="siteProtocolLabel" for="siteProtocol" class="col-sm-2 control-label">协议</label>
					<div class="col-sm-2">
						<input type="text" class="form-control" name="protocol" id="siteProtocol"  value="${cmsSite.protocol}" placeholder="输入协议...">
					</div>
					<label id="siteDomainLabel" for="siteDomain" class="col-sm-1 control-label">域名</label>
					<div class="col-sm-3">
						<input type="text" class="form-control" name="domain" id="siteDomain" value="${cmsSite.domain}" placeholder="输入域名...">
					</div>
					<label id="sitePortLabel" for="sitePort" class="col-sm-1 control-label">端口</label>
					<div class="col-sm-2">
						<input type="text" class="form-control" name="port" id="sitePort" value="${cmsSite.port}" placeholder="输入端口...">
					</div>
				</div>
				<div class="form-group">
					<label id="siteCopyrightLabel" class="col-sm-2 control-label" >版权信息0</label>
					<div class="col-sm-9">
						<textarea  name="copyright" id="siteCopyright" data-toggle="jeditor" data-upload="/system/config/file/add?type=1"  placeholder="输入版权信息...">
							${cmsSite.copyright}
						</textarea>
						<!--<input type="text" class="form-control" name="copyright" id="siteCopyright" value="${cmsSite.copyright}" placeholder="输入版权信息...">-->
					</div>
				</div>
				<div class="form-group">
					<label id="siteSeqLabel" for="siteSeq" class="col-sm-2  control-label">排序号</label>
					<div class="col-sm-4">
						<input class="form-control" name="priority" id="siteSeq" type="number" value="${cmsSite.priority}" placeholder="输入排序号...">
					</div>
					<label id="siteStatusLabel" for="siteStatus" class="col-sm-1  control-label">状态</label>
					<div class="col-sm-4">
						<select class="form-control" id="siteStatus"  name="validStatus"  value="${cmsSite.validStatus}" style="width: 100%;" placeholder="选择状态...">
						</select>
					</div>
				</div>
				<div class="form-group">
					<label id="siteDescriptionLabel" class="col-sm-2 control-label" >描述</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="description" id="siteDescription" value="${cmsSite.description}"  placeholder="输入描述...">
					</div>
				</div>
				<div class="form-group">
					<label id="siteRemarkLabel" class="col-sm-2 control-label">备注</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="remark" id="siteRemark" value="${cmsSite.remark}" placeholder="输入备注...">
					</div>
				</div>
				<div class="error-message text-center" >
					<span class="error-icon"></span>
					<span id="error-msg" class="error-msg" ></span>
				</div>
             </div>
			<div class="box-footer">
				<div class="text-center">
               		<button type="submit" class="btn btn-primary btn-sm"><i class="fa fa-paste"></i> 更新</button>
               		<button type="button" class="btn btn-default btn-sm" data-dismiss="modal"><i class="fa fa-close"></i> 关闭</button>
				</div>
          	</div>
		</form>
	</div>
</div>
<script type="text/javascript" src="${request.contextPath}/static/oms/iframe/plugins/jeditor/js/jeditor.js"></script>
<script src="${request.contextPath}/static/oms/iframe/plugins/fileupload/js/vendor/jquery.ui.widget.js"></script>
<script type="text/javascript" src="${request.contextPath}/static/oms/iframe/plugins/bootstrap-image-picker/js/imagePicker.js"></script>
<script src="${request.contextPath}/static/oms/iframe/plugins/fileupload/js/jquery.fileupload.js"></script>
<script type="text/javascript">
function ajaxSubmit(form) {
	
	var $form = $(form);
	
	if ($form.length === 1 && $form.validate()) {
        $.ajax({
            type: 'post',
            url: form.action,
            dataType: "json",
            data: $form.serialize()
        }).done(function(result){
            if (result.success) {
                $("#lgModal").modal('hide');
                alertMsg(result.message,"success");
				dataGridReload();
            } else {
                $form.find(".error-msg").show();
                $form.find(".error-msg").html(result.message);
            }
        });
	}
}

$(function() {
	$('[data-toggle="jeditor"]').each(function() {

		var $this = $(this)
		var editor = new jeditor($this);
		var uploadUrl = $this.data('upload');
		editor.config.uploadImgUrl= uploadUrl;
		editor.config.hideLinkImg = true;
		editor.config.uploadImgFileName='file';
		editor.config.containerHeight=400;
		editor.config.uploadImgFns = {
			onload:function (resultText, xhr) {
				var resultObj = eval('(' + resultText + ')');
				console.info('上传结束，返回结果为 ' + resultText);
				var editor = this;
				var originalName = editor.uploadImgOriginalName || '';  // 上传图片时，已经将图片的名字存在 editor.uploadImgOriginalName
				var img;
				if (!resultObj.success) {
					// 提示错误
					console.warn('上传失败：' + resultObj.message);
					alert(resultObj.message);
				} else {
					console.log('上传成功，即将插入编辑区域，结果为：' + resultText);

					// 将结果插入编辑器
					img = document.createElement('img');
					img.onload = function () {
						var html = '<img src="' + resultObj.data.urlFull + '" alt="' + originalName + '" style="max-width:100%;"/>';
						editor.command(null, 'insertHtml', html);

						console.log('已插入图片，地址 ' + resultObj.data.urlFull);
						img = null;
					};
					img.onerror = function () {
						console.error('使用返回的结果获取图片，发生错误。请确认以下结果是否正确：' + resultObj.data.urlFull);
						img = null;
					};
					img.src = resultObj.data.urlFull;
				}

			}
		};
		editor.create();
	});

    $("#siteFavicon").imageDynamicPicker();
    $("#siteLogo").imageDynamicPicker();
    $("#siteFaviconFileupload").fileupload({
        url: "/system/config/file/add",
        autoUpload: true,
        dataType: 'json',
        acceptFileTypes: /\.(jpg|png|gif)$/i, //浏览器支持File API才有效
        maxFileSize: 2097152, //2M，浏览器支持File API才有效
        send: function(e, data){
            alertMsg('上传中...',"success");
        },
        done: function (e, data) {
            alertMsg("上传成功", "success");
            $("#siteFavicon").val(data._response.result.data.url);
        },
        fail: function(e, data) {
            alertMsg("上传失败", "success");
        }
    });
    $("#siteLogoFileupload").fileupload({
        url: "/system/config/file/add",
        autoUpload: true,
        dataType: 'json',
        acceptFileTypes: /\.(jpg|png|gif)$/i, //浏览器支持File API才有效
        maxFileSize: 2097152, //2M，浏览器支持File API才有效
        send: function(e, data){
            alertMsg('上传中...',"success");
        },
        done: function (e, data) {
            alertMsg("上传成功", "success");
            $("#siteLogo").val(data._response.result.data.url);
        },
        fail: function(e, data) {
            alertMsg("上传失败", "success");
        }
    });

    $("#siteStatus").select2({
        data: StatusStore,
        theme: "bootstrap"
    }).val('${cmsSite.validStatus}').trigger("change");
	$siteEditForm = $("#siteEditForm");
	$siteEditForm.validate({
		rules: {
            name: {
                required: true
            },
            title: {
                required: true
            },
            protocol: {
                required: true
            },
            domain: {
                required: true
            },
            copyright:{
                required: true
            },
            description: {
                required: true
            },
            priority: {
                required: true
            }
        },
        messages: {
            name:{
                required:"名称不能为空！"
            },
            title:{
                required:"标题不能为空！"
            },
            protocol:{
                required:"协议不能为空！"
            },
            domain:{
                required:"域名不能为空！"
            },
            copyright:{
                required:"版权信息不能为空！"
            },
            description: {
                required: "描述不能为空！"
            },
            priority: {
                required: "排序号不能为空！"
            }
		},
		submitHandler:ajaxSubmit,
		errorLabelContainer:".error-msg",
		wrapper:"li",
		showErrors:function(errorMap,errorList) {
			if(errorList.length>0){
				$siteEditForm.find(".error-msg").html(errorList[0].message);
			}else{
				$siteEditForm.find(".error-msg").html("");
			}
		},
		onkeyup: false
	});
});
</script>